// slideDown卷下来 slideUp卷上去 slideToggle
// 卷帘门
//声明一个开关flag
//flag=true 表示已经展开了 flag=false 表示没有展开

$('#drop .container').find('div').slideUp(0, function () {
    $('#drop .container').css('display', 'block')
    $('div').prop('flag', false)
})

$('#drop .container').on('click', 'li', function () {
    // console.log($(this))
    // console.log($(this).find('div').prop('flag'))

    //获取当前的开关状态 如果是true 说明自己已经展开了 要收起来
    let flag = $(this).find('div').prop('flag')
    if (flag) {
        // console.log(123123)
        $(this).find('div').slideUp(200).prop('flag', false)
        return
    }

    $(this).find('div').slideDown(200).prop('flag', true).parent().siblings().find('div').slideUp(200).prop('flag', false)
})

let ul = document.querySelector('#drop .container')
new Promise((resolve, reject) => {
    let el = '';
    fetch('http://chst.vip:1234/api/getbrandtitle')
        .then(body => body.json())
        .then(res => {
            console.log(res)
            res.result.forEach(item => {
                el += `
                <li>
                    <p class="tit">
                        <span id='${item.brandTitleId}'>
                             ${item.brandTitle}
                        </span>
                    </p>
                </li>
                `
            })
            ul.innerHTML = el;
            resolve(res)
        })
})
    .then(res => {
        new Promise(() => {
            let lis = document.querySelectorAll('#drop>.container>li')
            res.result.forEach((item, index) => {
                let div = document.createElement('div')
                div.style.display = "none"
                let el2 = '';
                let id = item.brandTitleId
                fetch(`http://chst.vip:1234/api/getbrand?brandtitleid=${id}`)
                    .then(body => body.json())
                    .then(res => {
                        console.log(res)
                        let i = 0;
                        res.result.forEach(item => {
                            //http://chst.vip:8081/for-stu/wfzh/brand.html?title=xxx&brandtitleid=0
                            el2 += ` 
                                <a href="brandCollectionList.html?title=${item.brandName}&brandtitleid=${item.brandId}">
                                    <p class="num">${i}</p>
                                    <p class="nam">${item.brandName}</p>
                                    <p class="sal">${item.brandInfo}</p>
                                </a>
                            `
                            i++
                        })
                        div.innerHTML = el2;
                        lis[index].appendChild(div)
                    })
            })
        })
    })
